import { CHANGELOG } from "../changelog";
import { TextualState } from "../core/textual_state";

export class ChangelogState extends TextualState{
  constructor(){
    super('ChangelogState')
  }

  getStateHeaderTitle(){
    return '版本日志'
  }

  getMainContentHTML(){
    const entries = CHANGELOG;

    let html = '';

    for (let i = 0; i < entries.length; ++i) {
      const entry = entries[i];
      html += `
        <div class="entry" data-changelog-skin="${entry.skin || "default"}">
          <span class="version">${entry.version}</span>
          <span class="date">${entry.date}</span>
          <ul class="changes">
            ${entry.entries.map(text => `<li>${text}</li>`).join("")}
          </ul>
        </div>
      `;
    }

    return html;
  }

  onEnter() {
    const links = this.htmlElement.querySelectorAll("a[href]");
    links.forEach(link => {
      this.trackClicks(
        link,
        () => this.app.platform.openLink(link.getAttribute("href")),
        { preventClick: true }
      );
    });
  }
}